<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登陆界面</title>
    <script src="/html/js/axios.min.js"></script>
    <script src="/html/js/ajax.js"></script>
    <script src="/html/js/layui.js"></script>
    <link rel="stylesheet" href="/html/js/css/layui.css" media="all">
</head>

<script>
    //用户登录
    async function userLogin() {
        let username = $("username").value.trim();
        let password = $("password").value.trim();

        if (username == "" || password == "") {
            alert("请不要输入无效空白的内容");
            return;
        }

        let param = {
            username: username,
            password: password
        }
        let result = await ajaxGet("/user/login", param);
        if (result == "ok") {
            location.href = "/html/theme/theme.html"
        }
    }

    //重置
    function reset() {
        $("username").value = "";
        $("password").value = "";
    }

</script>

<body>
<div>
    <ul class="layui-nav" style="display: flex;justify-content: center">
        <li class="layui-nav-item"><a href="">首页</a></li>
        <li class="layui-nav-item layui-this"><a href="">登录</a></li>
        <li class="layui-nav-item"><a href="/html/login/register.html">注册</a></li>
        <li class="layui-nav-item"><a href="">退出</a></li>
        <li class="layui-nav-item"><a href="">管理</a></li>
        <li class="layui-nav-item"><a href="">风格</a></li>
    </ul>
</div>
<br>
<div style="padding:0 30px;display: flex;justify-content: center">
    <div>
        <label class="layui-form-label">用户名</label>
        <input type="text" name="username" id="username" required lay-verify="required" placeholder="用户名"
               autocomplete="off"
               class="layui-input" style="width: 200px">
        <br>
        <label class="layui-form-label">用户密码</label>
        <input type="text" name="password" id="password" required lay-verify="required" placeholder="用户密码"
               autocomplete="off"
               class="layui-input" style="width: 200px">
        <br>
        <button type="button" class="layui-btn" onclick="userLogin()">登录</button>
        <button type="button" class="layui-btn" onclick="reset()">重置</button>
    </div>
</div>
</body>
</html>